<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/theme/bootstrap.css" />
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/js/bootstrap/css/bootstrap-table.min.css" />
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/theme/bootstrap-responsive.css" /> 
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/theme/style.css" />
    <script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-1.11.3.min.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/js/theme/bootstrap.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/js/bootstrap/bootstrap-table.min.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/js/bootstrap/bootstrap-table-locale-all.min.js"></script> 
    <script type="text/javascript" src="${pageContext.request.contextPath}/js/layerui/layer.min.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/js/layerui/layer.ext.js"></script>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/skin/css/mobilecss/charge.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/skin/css/mobilecss/main.css">
    
    <style type="text/css">
        body {
            padding-bottom: 40px;
        }
        .sidebar-nav {
            padding: 9px 0;
        }

        @media (max-width: 980px) {
            /* Enable use of floated navbar text */
            .navbar-text.pull-right {
                float: none;
                padding-left: 5px;
                padding-right: 5px;
            }
        }
    
    </style>
</head>
<body>

	<div class="alert" id="alertDivId" style="display: none;z-index: 100; padding-right: 5px;padding-top: 0px;">
        <div >
            <p>游戏ID：<input type="text" id="cGameId" name="cGameId" style="width:80px" >&nbsp; 
            <input type="button" value="搜索" style="height: 30px;" onclick="selectRecevieCardUserClick()" > </p>
            <p style="margin-top:1rem">玩家信息</p>
            <p>游戏ID: <span id="gameIdlab"></span></p>
            <p>微信昵称：<span id="namelab"></span></p>
            <p>备注：<input type="text" id="remark" name="remark" value=""> </p>
            <input type="hidden" id="crowdgameId" name="crowdgameId">
            <br style="height: 20px">
            <div>
                <button id="ok" onclick="confirmAgentClick()">确认绑定</button>
                <button style="background-color: #666;margin-left: 5%" id="close" onclick="closeAlertClick()">取消</button>
            </div>
        </div>
    </div>

<!-- <div align="center">

</div> -->
<form class="form-inline definewidth m20" action="index.html" method="get">  
   时间段： <input id="startTime" placeholder="开始时间" type="date" style="width: 130px;height: 30px"> 
    <input id="endTime" placeholder="结束时间" style="width: 130px;height: 30px" type="date">  <br>
    玩家ID： <input type="text" name="gameId" id="queryGameId" class="abc input-default" style="width: 130px" >
    <button type="button" onclick="query()" class="btn btn-primary">查询</button>&nbsp;
</form>
 <table id="mytab" class="table table-striped table-bordered"></table> 
 <br>
</body>
<script>
	
	function query() {
	    var gameId = $('#queryGameId').val();
	    var startTime = $('#startTime').val();
	    var endTime = $('#endTime').val();
	    $('#mytab').bootstrapTable("refreshOptions", {
	        queryParams: function (params) {
	            params.numPerPage = params.limit;
	            params.pageNum = params.offset / params.limit + 1;
	            params.gameId = gameId;
	            params.startTime = startTime;
	            params.endTime= endTime;
	            return params;
	        }
	    });
	    $('#mytab').bootstrapTable({
	        url: "${pageContext.request.contextPath}/wechat/crowd_flow_data.html", //数据源
	       // height:tableHeight(),
	        dataField: "rows", //服务端返回数据键值 就是说记录放的键值是rows，分页时使用总记录数的键值为total
	        pagination: true, //是否分页
	        pageSize: 10, //单页记录数
	        pageList : [10,20,50,100,200 ],//分页步进值
	        sidePagination: "server", //服务端分页
	        contentType: "application/x-www-form-urlencoded", //请求数据内容格式 默认是 application/json 自己根据格式自行服务端处理
	        dataType: "json", //期待返回数据类型
	        method: "post", //请求方式
	        searchAlign: "left", //查询框对齐方式
	        locale: "zh-CN",
	        queryParams: function (params) {
	                params.numPerPage = params.limit;
	                params.pageNum = params.offset / params.limit + 1;
	                params.gameId = gameId;
		            params.startTime = startTime;
		            params.endTime= endTime;
	                return params;
	            },
	            buttonsAlign: "left", //按钮对齐方式
	            paginationHAlign:"left",
	        columns: [{
	            field: "gameId",
	            title: "玩家ID",
	        }, {
	            field: "nickName",
	            title: "玩家昵称",
	        }, {
	            field: "gameName",
	            title: "游戏类别",
	        }, {
	            field: "gameNub",
	            title: "游戏局数",
	        }, {
	            field: "useNub",
	            title: "消耗房卡",
	        }
	        ,{
	            field: "startTime",
	            title: "完成时间",
	        }]
	    }).on("click-row.bs.table", function (args, row, $element) {
	        
    });}
	
	
	
	
	
	// 搜索玩家
	function selectRecevieCardUserClick() {
    	var gameId = $('#cGameId').val();
   		if(gameId.length >= 1) {
   	    	//玩家id
       		$.post("${pageContext.request.contextPath}/admin/card_add_mobile.html",
    		        {"gameId":gameId},
    		  function(data){
		            	var json = eval("("+data+")");
						if(json.statusCode =='200'){
							if(json.playerInfo!=null){
	   							$('.shou_info').css("visibility","visible");  
	   							$("#crowdgameId").val(json.playerInfo.gameId);
	   							$("#gameIdlab").html(json.playerInfo.gameId);
	   							$("#namelab").html(json.playerInfo.nickName);
							}else{
								$("#userId").val("");
								layer.alert(" 请输入有效的玩家ID ");
							}
   					}
    		  });
       	}else{
       		layer.alert(" 请输入玩家ID ");
       	}
    }
	
	// 邀请玩家 加入牌友圈
	function confirmAgentClick(){
		if($("#crowdgameId").val()==""){
			layer.alert(" 请输入玩家ID ");
			return;
		}
	   var msg = "确认邀请玩家  [ "+$("#namelab").html()+" ] 游戏ID为 "+$("#gameIdlab").html()+"，加入牌友群，该玩家开房将扣您的欢乐豆？ ";
    	layer.confirm(msg, {
    	    btn: ['确认','取消'], //按钮
    	    shade: false //不显示遮罩
    	}, function(){
    	    $.post("${pageContext.request.contextPath}/wechat/crowdUser_add_save.html",
    	            {"crowdgameId":$("#crowdgameId").val(),"crowdId":$("#crowdId").val(),"remark":$("#remark").val()},
    	       function(data){
    	            	var json = eval("("+data+")");
    	            	$('#usersave').removeAttr("disabled");  //移除disabled属性 
    					if(json.statusCode =='200'){
    						layer.msg(json.message , {icon: 1});
    						$('.alert').css('display', 'none');
    						setTimeout("query()",2000);
    					}else{
	    					layer.msg(json.message, {shift: 6});
    					}
    	      });
    	});
	  }
	
	 // 
	function setAgentId(){
		$(".alert").css('display', 'block');
	 }
	
	 function closeAlertClick() {
			$('.alert').css('display', 'none');
	 }
	 
	 function delPlayer(crowdUserId,gameId){
	    	var msg ="将玩家ID:"+gameId+" 移除该俱乐部？";
	    	layer.confirm(msg, {
	    	    btn: ['确认','取消'], //按钮
	    	    shade: false //不显示遮罩
	    	}, function(){
	    	    $.post("${pageContext.request.contextPath}/wechat/crowdUser_del.html",
	    	            {"crowdUserId":crowdUserId},
	    	       function(data){
	    	            	var json = eval("("+data+")");
	    	            	$('#usersave').removeAttr("disabled");  //移除disabled属性 
	    					if(json.statusCode =='200'){
	    						layer.msg(json.message, {icon: 1});
	    						setTimeout("query()",2000);
	    					}else{
		    					layer.msg(json.message, {shift: 6});
	    					}
	    	      });
	    	});
	}
	 
    $(function () {
    	query();
    	
	});

</script>
</html>